#scanline filter

[wirewitchviolet]

I need to rant a bit about scanline filters.

The one big riddle I still need to solve in this whole designing my own console thing is how I'm outputting the graphics, and as you might imagine, as I try to research this, I mostly keep running across forum posts and such from people trying to recreate the experience of playing their favorite old console games (or new games going for that sorta vibe) including the distinct differences between modern monitors and the CRTs they had back in the day. And a big part of that involves stumbling onto so damn many "scanline filters" that drive me up the wall.

If you zoom way the hell in on the above image, it is, to be fair, attempting to simulate a particular thing, but what it's simulating is not scan lines, and if the goal here is to look like a CRT, then essentially outlining every pixel with a black border, which is what this at least appears to be doing at a distance, is WILDLY wrong. If anything, color should be bleeding all over and filling any darker spaces.

I'd like to actually get into scan lines before getting into the other stuff that's wrong with this, but let me just hit you with another terrible example of what people call a "scanline filter" first just so we're on the same page.

For real here, what the hell are we even doing? The functional definition of what a "scanline filter" is seems to just be interlacing. That is to say, making every other row of pixels black. Now, this is at least a little bit tied to "retro graphics." I recall playing Day of the Tentacle back when it was new, and AT THE TIME, as the game itself had a maximum resolution of 320x200, and would be displayed on a monitor that even on the cheap end would be outputting at at least two or three times that, the graphics settings had an "interlaced mode" which rather than just displaying each pixel of the game's art as a 2x2 or 3x3 or 4x4 or whatever block of actual-monitor display pixels, it would only draw half of those, leaving alternating black lines that absolutely made it look like you were watching the whole game through some sort of mesh screen left half the visual information to your imagination, so you could just kinda pretend the resolution was higher and fill in the gaps between lines of pixels with your imagination.

But again, THAT HAS NOTHING TO DO WITH SCANLINES!

When you have a CRT, rather than having a big array of liquid crystal squares or heated plasma blocks or LEDs or whatever other weird thing people are using now that just have a direct current run through to turn them on and off, you have this absolutely bonkers mad science to-this-day-I-can't-believe-someone-even-thought-to-do-this-let-alone-it-being-plan-A gun just straight up firing out electrons in an accelerated stream that is aiming around at practically unfathomable speeds shooting at dots of phosphor painted onto a sheet causing them to glow with an intensity proportionate to how many electrons they're getting hit with. We don't have a separate gun for each dot, just the one hitting each in turn (well, 3 really, we have separate guns for the red green and blue dots). And specifically, because I suppose the alternative would be to encode the signal for every other line backwards to keep shooting on the return trip or something, what they would do is sweep (or if you prefer scan) across from left to right, light up one row of dots, swing back and drop down slightly, sweep across the next line, and so on, then on finishing the final line swing back up to the top left corner to start sweeping across energizing all the phosphor dots at the right intensity for the next frame of video. Or really if you want to get technical I believe they'd hit more like: every odd line on the first pass, reset, hit every even line, reset, new frame, repeat. I guess reading about that is where people get this interlacing idea from maybe?

Anyway, if you wanted to simulate this on a modern display, you'd just need to draw a new frame for every scan line in real time (ideally more since it's not like the line appears all at once, we're really hitting one dot at a time and going down the line). We literally can't do that though. We're probably simming a standard definition TV right? Well the standard differs depending where you are in the world, but the big two are the NTSC standard, which draws one frame composed of 480 lines 60 times a second, and the PAL standard of 576 lines 50 times a second. That's easy math to do. We just need a refresh rate of... 28,800 FPS. Or ideally more, because again, you'd want to draw each line over multiple frames... and that's just for a standard TV. If we're simming a monitor, there were CRTs out there that I THINK still managed 60 FPS while spitting out 1600 or so lines on each frame.

Unless I'm severely mistaken, modern display technology just straight up cannot get anywhere near that. It's rare to find a display that can go any higher than 60 and again, we're drawing a whole screen in that time so the lines aren't relevant there. I'm not even sure if the materials currently glowing/controlling how much light gets out can, on their own, flip on and off as a phosphor dot being pelted with electrons, but I DO know we're still setting pixel brightness one at a time, a line at a time, so what would there really even be to sim there? Hell, famously, filming CRTs never works right because most cameras' shutter speed won't catch things right, and if you use a super high speed camera you actually CAN see the scan lines being rendered one by one but you're catching so little light you're kind of only seeing the one line, as in this video here:

Now, displays back in the day, and also displays, you know, now, break out the red/green/blue components and just cram something close enough together to blend together and give you some single color with a ton of potential range. It's an illusion technically, much like the whole screen being lit at once and not just the last thing to get an update or getting hit with electrons. So let's get back to those black pixels in these filters and what they're actually trying to simulate and how dumb all that is. Have a couple more visual aids plucked from the above video.

Now you might be looking at this first image here and thinking "aha! Look! There totally are solid black lines between the pixels!" but that first one is the modern high res display. The second image is the one from a CRT. You will notice there is an offset, such that even with crazy high zoom there is no horizontal line you can draw through here that's ever going to be all black (unless that part of the screen is showing something black). Furthermore, again, it's important to keep in mind that while in that first image, every subpixel you're looking at is, in fact, glowing steadily over a period of time, at any given instant, only ONE of these little phosphor strips (of each color) is actually getting shot with electrons and doing its full-bright glow. When a given dot on the screen is active it is WAY brighter than what the camera here can detect and if you're really looking at one, your eyes are taking so long to process that you don't even notice that literally only the 3 are active at a time. Even this camera here is catching a bunch of fading afterimages. Point is, in real life, this display isn't anywhere near this dark.

So OK, let's say you're doing your CRT filter effect, which again, you should NOT be calling a "scanline filter" by all means make use of the higher resolution you have to work with and have like 5 redscale pixels, 5 black pixels, 5 greenscale pixels, 5 black, 3 bluescale, 5 black, then shift alternate columns down by 3, BUT if you're gonna do that, remember to have the brightness cranked way up on those bright ones, and also bring up the corresponding color values of the surrounding few pixels to properly portray that intense emissive glow. i.e. the "black pixels" between red and blue aren't really black they're some shade of purple or magenta or whatever, and hell ideally the color bleed shout cover at least one neighboring "pure color" column. Because nothing on a CRT has ever looked like you're looking at it through a screen door like all these filters floating around.

Oh and side not to everything, that offset hex grid-y shadowmask arrangement was I think the most popular for color CRT TVs but different people roll in different ways. Pretty sure this was more common for PCs with higher available resolutions, for instance:

For real though, you could light a whole room pretty well just having a TV on back when everyone had CRTs. I do not understand why all these filters make everything so much darker.

Also speaking of darkness, I'm sitting in it because I am completely bottomed out on money and I'm penny pinching every way I can so... patreon, maybe?

[thatcageofuncleanbirds]

generally speaking, i usually do play pre-2007ish games on my fuckoff giant consumer quality crt, and, like, vn art does look so much better on that type of screen... im playing them on this tablet because its portable, but i long for that crt distortion, so the filter is like a slop treat perfect for me

[morebagels]

^ iterator projection tutorial!! ^

this post follows on from this one made by @prismsoup, intended to cover my slightly more extended process (including post-processing)

step -1 : pre-requisites

this tutorial is designed around clip studio paint for PC because its what i work with. its probable that whatever other program / platform you're using has these features but under different names

i use a rainworld typography font for text. find it here (or do it yourself)

i use scanline textures as a part of this. find them here

step 0 : select a base image

maps, blueprints and diagrams are favourable due to lots of detail without it derailing into noise. get experimental though, my favourite one came out from a picture of a nebula, and another from a friends factorio screenshot

step 1 : binarise & flip

this command can be found under edit > tonal correction (D) > binarization. this forces every pixel in the image to be either black or white. adjust its sensitivity to your liking

step 2 : remove background

add in a black layer below (not just paper layer, as will become important later). wand select the background colour and delete it. if the remaining colour is black, CTRL+I to invert it to white

step 3 : add details

replace any text with rainworld font or simply remove it. add in blueprints or other complex decals (drawingdatabase is a decent source). during importing remember to binarise (after resizing). for "lower layer" elements such as contour lines create outlines for higher layers to retain clarity

step 4 : add multiply layer(s)

if you want to have multiple colours, put everything in the "higher" layer into a folder and set the top multiply to clipping above it

step 6 : post processing setup

copy all existing layers, create a new folder on top, and paste into that folder. right click the folder and "merge selected layers" set the resultant layer to add(glow). copy+paste and hide duplicate for now. from filters > blur apply a guassian blur with a strength of 130-170 (this creates the base bloom layer). set opacity to ~50%

step 7 : chromatic abberation

unhide not-blurred layer. guassian blur with a strength of 2. duplicate again. select top layer and move 1px up and 1px left (with arrow keys). CTRL+U then change the hue by 30. select bottom layer and move 1px down and 1px right, CTRL+U then change hue by -30.

stronger chromatic abberation can come from stronger gaussian blur and more change in hue

step 8 : scanlines

add the scan lines on top, invert so that they're white and set to add(glow). copy a multiply layer over it and make sure clipping is on. decrease layer opacity to ~10%. if it does not cover the whole image initially, paste more in and merge them together into one layer

tada! you now have one iterator projection. if you want to give it an extra affect, re-import the final PNG and filter > distort > convert to panorama. set distortion to 10 and scale to 101 (note that this drastically blurs the image)

[kalpasoft]

There were a few things that I thought I could really go either way with 30fps/60fps scanline filter/no scanline filter

so I just made them togglable.

The resolution thing isn't finished yet so it's not really doing anything in the clip.

[preemshots]

⏩ SMART FRAMES ENHANCED

the smart frames added in cyberpunk patch 2.2 have a ton of filters that make displayed images lose clarity, and they are often way too bright or too dark. this mod fixes that! FEATURES

clearer images - removes dirt/blurring/layer separation effects from smart frames

decreases interaction radius size - stand closer to interact

makes all smart frames equal brightness

3 options for screen brightness - default bright, darker, extra dark

optional files to remove the subtle screen scanlines animation

optional: default image replacer - replaces "smart screen" image with a similar screenshot, no logo

📸 available on nexusmods

[foone]

So Warframe added a "Pom-2" Alternate 1999 computer (that's needed for weird void magic future science wizardry). Thoughts?

Only thing I have that's a sort of question mark is that I don't know of many setups that would have needed a 5 1/4" floppy in 99 (or why it has both the tower and the under monitor unit)

ugh. OKAY, so... the tower and desktop combination is just weird. I have, on one occasion, run a "server" that was two towers, and the original PC supported a DUAL-DESKTOP mode, but both types together? nonsense.

dual monitor was rare but possible in 1999 (win98 added native support), so I think the best interpretation here is that this is actually two computers. maybe the one on the left is missing the keyboard and mouse because it's being used as some kind of server for the other computer? I used a little case like that to run my first linux server, which was also acting as a router for my internal network.

The OS is weird. The icons above the menu-bar look like win98, the dialog box is windows 3.x, the menu-bar icons on the bottom are pure os X (although they remind me of like a web-TV kinda system, like hotkeys for email/internet/etc), but the greyscale is very classic mac system. Actually it kinda reminds me of C64's GEOS, but GEOS was very classic-mac.

Like most CRT-filters, they turned the scanlines up WAY TOO HIGH. No CRT I've ever seen looked that fucking terrible. The monitor buttons are a bit odd: You didn't get monitors with buttons on the front until long after they were all color... but maybe it's a color monitor that's showing a monochrome OS?

as for the floppies: yeah. There are multiple mistakes here.

5.25" in 1999 is just silly. If you still had 5.25" disk drives in 1999, you were intentionally doing some retrocomputing stuff. For reference, around 2001 my PC repair job would specifically ask me to copy data off 5.25" disks, because they didn't have any 5.25" drives anymore, and I was their only tech who did.

The other mistake is that they have THREE floppy drives. so the PC doesn't really support that, natively? You can do some tricks and make it work (The youtuber Tech Tangents did a video on how it could be done), but realistically two was the normal max.

The final mistake is that all the drive activity lights are on. Those are only supposed to be on while the drive is reading or writing... and I don't see any disks in those drives! Let alone a situation that would involve turning all three on at once (I don't think that's even possible on most floppy controllers!)

In fact, the main time you'd end up with the drive lights stuck on like that is when you've installed the drive cable upside down. That ends up with them getting stuck on and non-functional. So this computer looks, to me, like it was put together incorrectly and no one noticed.

I don't believe that font would be on a black & white retro computer. Nope. Too smooth and too big.

There's also a USB icon on that OS: I don't think there's ever been a monochrome OS that supported OS, and looking at that computer case I don't believe that it has USB. Maybe the tower would, but the desktop? no.

That keyboard is off a Gateway 2000 computer. Something like this:

[elle-p]

THE MENU'S YELLOW

Kind of need to see what Persona 3 looks like on a crt

[bugmash]

This pixel art, but in 3D, tilted so it looks mountainous, and with a scanline filter over it

Bitchin' 😎

[modormouth]

[jeffgerstmann]

Hi Jeff, you’ve made your feelings on CRT filters in general clear, but I’d be interested to hear what you think of some of the Retroarch shaders like the mega bezel packs by Cyberlab. By and large I agree with you and never use CRT filters in commercial products because they look awful and are dumb conceptually, doubly so for myself because I work for a vintage tech museum and see games running on CRTs every day. But crt-royale, in particular, looks so amazing that it’s become the first thing I’ve found that I prefer to unprocessed pixels. It doesn’t look like shitty fake scanlines, it looks indistinguishable from a real CRT (to the extent that you can actually see the individual RGB pixels if you’re up close), and more importantly it doesn’t feel like it’s occluding the screen or taking anything away from the pixels, only adding a bit of shape and more complex shading to games that enhance the look immensely to me.

Of course I’m not looking to convert you or act like you’re dumb for rawdogging your pixels or anything, just to let you know that there’s now an option there that was impressive to someone who otherwise agrees with you completely on the subject!

I think the only thing I've tried that's managed to sell me on the idea of fake scanlines is the RetroTink-4K, which is very capable in a ton of really fascinating ways. Once you start mixing in VRR and OLED screens and all that, it starts to get interesting. Still not exactly enthusiastic about them, but I'll usually use them via the RT4K with the MiSTer, since it has very handy presets.

CRT Royale looks fine, it's been around for awhile now.

Either way, fake scanlines tend to look like shit when you're streaming it out, so I don't really devote much time to them.

[ask-artsy-oncie]

Can we see the big version of lollytea's icon? If that's ok

Sure lol

Merry Crisis!

(This one has a scanline filter on it, her icon is the version without the filter)

[game-boy-pocket]

Man, I know as a person who still plays games on real hardware, and therefor has zero stake in NSO, or I guess we're calling it Nintendo Classics now, this shouldn't upset me, but I cannot help but feel a bit annoyed at this stupidity.

Why did they make a fucking "CRT Filter" Switch 2 exclusive?

Don't most normies think "Clear display more better" and always play with video filters off? This isn't going to sell more Nintendo Switch 2's.

And don't you dare tell me the Switch 2 doesn't have the horse power for a CRT filter, because Nintendo isn't actually using a video filter it's literally just a PNG overlay of scanlines, not a real video filter at all.

Aint no way anybody in the world but me cares about this, because as I said, normies don't like the look of CRT, and Retro Enthusiasts prefer playing on real CRTs anyway. But IF I MUST play a Retro game on a modern screen, I at least like the option to be there, yes I know the Final Fantasy Pixel Remaster's CRT filter is kinda shit but im still using it because I just prefer it to perfectly clean pixels.

[adachimoe]

I played Aegis: The First Mission as it was released on Steam yesterday. Predictable, but cute.

Not sure if the game is supposed to "canon" or not. The plot is Aigis training on Yakushima under a guy named Aizawa who was hired by the Kirijo Group. She is assisted by three scientists at the Kirijo lab, Kimijima (Aigis's creator-mom-figure who also wears a red ribbon), Sayama (weapons / tech lady who looks like she's wearing baggy lounge pants - what a mood), and Takeba / Yukari's dad. To Kimijima, Aigis is more than just an anti-Shadow robot, which causes a conflict of interest between her and the wishes of the Kirijo Group.

It explains how Aigis got her character speech quirk as well. In Persona 3, she uses the Japanese copula であります (I believe this was localized into her saying, "...as they say" in Reload), and First Mission explains that she does this because Aizawa instructed her to. (At the end of First Mission, she gets her memories wiped due to what happens on Yakushima, but I suppose her still using the same copula in Persona 3 suggests that some things aren't just memories.)

There are some comical details like how you get around Yakushima via bus, giving the mental image of Aigis boarding a civilian bus back to the lab, equipped with a grenade launcher and finger guns.

The gameplay is kiiinda ass as you awkwardly turn Aigis around to fire at things and try to aim Palladion, but it is a port of a 2007 flip phone game. Unfortunately, the port itself is kinda buggy. The fade-to-black effect during cutscenes seems to be broken, so you will see Aigis Naruto run out a door, except her model stops there and you see it semi-fade to black. There is also supposed to be some kind of faded scanline filter effect on portraits when Aigis is talking to people via communicator that is absolutely broken and just shows horizontal, fully visible lines over people's faces--it is kinda comical. Neither of these really interfere with gameplay though.

Maybe check it out an English patch is released? Afaik, there's a group of people working on doing it already.

[mimiyanna]

"So no scanlines?"

No, my beloved. I must apologize to your sensibilities, but I find them ugly. Actual, real scanlines on older systems are beautiful and angelic. But trying to replicate that by just putting a filter over an HD game in the 2020s is pure folly.

[irbcallmefynn]

Cringetober 2023 #17: Fake Anime Screenshot

I Magicked My Mouth Off So Now I Live A Life Of Crime was a super underrated anime IMO. The artstyle was a bit odd but the worldbuilding was spectacular! Shame it only got one season though...

Obviously, my artstyle doesn't really lend itself to anime all that well, so I had to kinda hit a middle ground on that. I'm pretty happy with how it turned out!

This is meant to be when Fynn magicked his mouth off at the wizard convention. The clouds from the spell are too thick to see what happened to anyone else but trust me, it isn't pretty. Fynn got off pretty lightly all things considered.

For those curious, the Japanese (which I translated with the internet so forgive me if it's awful) just says, "What happened to my mouth?"

Also I forgot to add a shadow ＞﹏＜! I didn't realize until I already did all of the filters so it would've been a pain to go back and fix.

On the topic of the filters, I had to do most of them manually! Paint.net has filters, but no chromatic aberration or scanlines or anything. They aren't too hard to replicate though.

Clear version under cut